<script setup>
import getUserById from '../api/getUserById.js';
import { InfoFilled,Plus } from '@element-plus/icons-vue'
import { useUserStore  } from '../stores/user'
import {ref ,onBeforeMount,computed, reactive} from "vue"
import getImage from '../api/getImage';
import isAdmin  from '../api/isAdmin';
import { useRouter } from 'vue-router';
const props =  defineProps({
    value:String
})
const use = useRouter()
const an_state = ref(false)
const userInforms= ref({})
const imageValue = ref("")
onBeforeMount(()=>{
    getUserById(Number(props.value)).then((res)=>{
        if(res.status == 200)
        {
            userInforms.value = res.data
            getImage(userInforms.value.imageId).then((res)=>
            {
                if(res.status == 200)
                imageValue.value = res.data 
            })
            console.log(res.data)
        }
    })
    
})
</script>

<template>
    <el-card>
            <template #header>
                    <div style="display: flex;">
                        <el-avatar class="image-box" shape="square" :size="100" :src="imageValue" />    
                        <div style="font-size: 14px; padding-top: 7%; padding-left:2% ; margin-left: 6%;">
                        用户编号：<span>{{ userInforms.userId }}</span>
                        <br> 
                        用户名： <span>{{ userInforms.userName }}</span>
                        <br>
                        </div>
                    </div>
                    
                    </template>
                    <div><el-button @click="use.push('/selfInform?userId='+userInforms.userId)" text>查看详情</el-button></div>
                <template #footer> </template>
    </el-card>
</template>

<style>
</style>